/**
 * Created by ljf on 2018/4/19.
 * 头条(两条内容向上滚动)
 */
import React, {Component} from 'react';
import {Image, PixelRatio, StyleSheet, Text, TouchableWithoutFeedback, View,} from 'react-native';
import {img_url} from "../../configs/platform.js";
import Swiper from '@nart/react-native-swiper';

export default class NoticeView extends Component {

    // 构造
    constructor(props) {
        super(props);
    }

    createChildView(infoList) {
        let views = [];
        {
            infoList.map((info, i) => {
                views.push(
                    <TouchableWithoutFeedback key={'new_notice_' + i}
                                              onPress={e => this.props.noticePressHandle(info.url)}>
                        <View style={styles.viewforItem}>
                            <View style={styles.mainTitle}>
                                <Text
                                    style={styles.mainTitleText}>{info.tag}</Text>
                            </View>

                            <Text
                                style={styles.itemTitle} numberOfLines={1}>{info.title}</Text>
                        </View>
                    </TouchableWithoutFeedback>
                );
            });
        }
        return views
    }

    render() {
        if (IsNullOrEmpty(this.props.data) || IsNullOrEmpty(this.props.data.infoList)) {
            return null;
        }
        return (
            <View
                style={styles.container}>
                <Image style={styles.notice_img} resizeMode={'contain'}
                       source={require('../../images/ic_news_single.png')}/>
                <View style={styles.item}>
                    <Swiper horizontal={false}
                            dotColor={'transparent'}
                            activeDotColor={'transparent'}
                            loop={true}
                            autoplay={true}
                            showsButtons={false}
                            autoplayTimeout={3}
                            ref={(swiper) => {
                                this._swiperVertical = swiper;
                            }}>
                        {this.createChildView(this.props.data.infoList)}
                    </Swiper>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        paddingLeft: 18,
        paddingRight: 10,
        flexDirection: 'row',
        backgroundColor: 'white',
        alignItems: 'center',
        height: 39,
    },
    notice_img: {width: 60, height: 15, marginRight: 16,},
    item: {flex: 1, backgroundColor: 'white', paddingVertical: 5},
    mainTitle: {
        borderRadius: 2,
        borderWidth: 1 / PixelRatio.get(),
        borderColor: '#EC3B2C',
        paddingLeft: 4,
        paddingRight: 4,
        paddingTop: 2,
        paddingBottom: 2,
    },
    mainTitleText: {
        color: '#C82F18',
        fontSize: 10,
    },
    itemTitle: {color: '#333333', fontSize: 13, marginLeft: 12, paddingRight: 10},

    viewforItem: {
        flexDirection: 'row',
        paddingTop: 5,
        alignItems: 'center',
        paddingBottom: 5,
        height: 29,
    },

});

